<template>
  <div class="lesson-Plan">
    <el-table :data="tableData" height="50vh">
      <el-table-column prop="date" label="日期" width="100" />
      <el-table-column prop="name" label="课次" width="50">
        <template #default="scope">
          {{ field_format(scope.$index, "classIndex") }}
        </template>
      </el-table-column>
      <el-table-column prop="address" label="时段" width="100">
        <template #default="scope">
          {{ field_format(scope.$index, "timeRange") }}
        </template>
      </el-table-column>
      <el-table-column prop="address" label="课程">
        <template #default="scope">
          {{ field_format(scope.$index, "curriculum") }}
        </template>
      </el-table-column>
      <el-table-column prop="address" label="教学目的">
        <template #default="scope">
          {{ field_format(scope.$index, "instructionalObjective") }}
        </template>
      </el-table-column>
      <el-table-column prop="address" label="实训内容" min-width="200">
        <template #default="scope">
          {{ field_format(scope.$index, "trainingContent") }}
        </template>
      </el-table-column>
      <el-table-column label="实训设备">
        <template #default="scope">
          {{ field_format(scope.$index, "trainingEquipment") }}
        </template>
      </el-table-column>
      <el-table-column label="教学重点">
        <template #default="scope">
          {{ field_format(scope.$index, "teachingFocus") }}
        </template>
      </el-table-column>
      <el-table-column label="教学难点">
        <template #default="scope">
          {{ field_format(scope.$index, "teachingDifficulties") }}
        </template>
      </el-table-column>
      <el-table-column label="教学辅助手段">
        <template #default="scope">
          {{ field_format(scope.$index, "teachingAids") }}
        </template>
      </el-table-column>
      <el-table-column label="教学后记" width="80" align="center">
        <template #default="scope">
          {{ field_format(scope.$index, "teachingPostscript") }}
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup lang="ts">
const { proxy } = getCurrentInstance();
let props = defineProps(["info", "archiveBinding", "type"]);
import useCounterStore from "@/store/counter";
const counter = useCounterStore();

let templateUrl;
let tableData = ref([]);
let archiveBindingList = [];
let classDetails = ref({});

function field_format(index, key) {
  if (!archiveBindingList.length) return;
  if (index <= archiveBindingList.length - 1)
    return archiveBindingList[index][key];
  return "";
}

function downLoadTemplate() {
  window.location.href = templateUrl;
}

async function getTemplateUrl() {
  templateUrl = await proxy.$apis.fileTemplate({
    data: { type: props.type },
    type: "downLoad",
  });
}

async function getInfo() {
  let resp = await counter.getTeachingPlan(props.info._id);
  tableData.value = resp.tableData;
  archiveBindingList = resp.archiveBindingList;
  console.log("嘻嘻嘻嘻", tableData.value);
  console.log("哈哈哈哈", archiveBindingList);
}

async function exportWord() {
  if (!templateUrl) return proxy.$utils.showToast("请先设置模板");
  //return console.log("教案", JSON.stringify(data));
  let list = await counter.lessonPlanExportParams(
    tableData.value,
    archiveBindingList,
    props.info._id
  );
  //return console.log("list", list);
  let url = await proxy.$apis.classDocExport({
    templateURL: templateUrl,
    data: { list },
    fileName: "教案.docx",
  });
  window.location.href = url;
}

watch(
  () => [props.info, props.archiveBinding, props.type],
  (newValue, oldValue) => {
    if (newValue) {
      getTemplateUrl();
      getInfo();
    }
  },
  { deep: true, immediate: true }
);

defineExpose({ exportWord, downLoadTemplate, getTemplateUrl });
</script>

<style lang="scss" scoped>
.lesson-Plan {
  .add {
    width: 100%;
    margin-bottom: 15px;
  }
}
</style>
